/*
//
// BEGIN SONGBIRD GPL
// 
// This file is part of the Songbird web player.
//
// Copyright(c) 2005-2008 POTI, Inc.
// http://songbirdnest.com
// 
// This file may be licensed under the terms of of the
// GNU General Public License Version 2 (the "GPL").
// 
// Software distributed under the License is distributed 
// on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either 
// express or implied. See the GPL for the specific language 
// governing rights and limitations.
//
// You should have received a copy of the GPL along with this 
// program. If not, go to http://www.gnu.org/licenses/gpl.html
// or write to the Free Software Foundation, Inc., 
// 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
// 
// END SONGBIRD GPL
//
*/
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 
@namespace html url("http://www.w3.org/1999/xhtml");

/******************************************************************************
> FEATHERS.CSS
*******************************************************************************

TABLE OF CONTENTS
> BASE
> TEXTBOXES
> BUTTONS
> TABS
> NOTIFICATION
> STATUS BAR
> SELECTED STATES
> DISABLED STATES
> TITLE BAR
> SERVICE PANE
> DRAG BADGE
> FACEPLATE
> PLAYLIST COMMAND BAR
> NAV BAR
> DISPLAY PANES
> SPLITTERS
> DEVICE SUMMARY PAGE
> FIRST RUN WIZARD
> TRACK EDITOR
> MEDIACORE ERROR DIALOG
> SMART PLAYLIST EDITOR
> ABOUT DIALOG
> FIND BAR
> SCROLLBAR
> WINDOW RESIZERS
> FILE DOWNLOAD MANAGER (MOZAPP)
> ABOUT CONFIG (MOZAPP)
> PREFERENCES (MOZAPP)
> FIREFOX API

******************************************************************************

This feather focuses on images more than styles defined though CSS. Often 
times you'll update colors in this file but wont see any change in the final 
appearance because there is a background-image that is drawn over it. There 
are a few colors defined in this file that might be of interest:

Often used by boxes that contain elements that update what is displayed in the 
content pane. eg: service pane, find bar, top half of the device summary 
page, command bar.
> rgb(220,220,220);

The following is used by all/most borders in the content area. eg: borders for 
filer pane splitters, border for treecols and list headers.
> rgb(161,161,161);

The following is used by all/most borders in the chrome area. eg: splitter for 
service pane, splitters for display panes, borders for windows/dialogs/wizards.
> rgb(131,131,131)

This file contains most but not all colors used in the feather. The styles in 
the following files need to be there for technical reasons.
> formsImport.css for text selection color
> os-specific/max/overrides.css for Mac-specific styles
> os-specific/unix/overrides.css for Linux-specific styles
> os-specific/win/overrides.css for Windows-specific styles

All the other CSS files in the feather and elsewhere in the app need major 
clean up. Don't go there if you can help it, for now.

******************************************************************************

We are eager to hear your feedback - please drop by and say hi:

songbird-dev Google Group:
http://groups.google.com/group/songbird-dev

IRC:
irc.mozilla.org #songbird

******************************************************************************/





/******************************************************************************
> BASE

  Mostly vanilla elements that act as the starting point for rules to follow.
******************************************************************************/
wizard,
dialog,
window,
prefwindow,
panel {
  background-color: rgb(245,245,245);
}
page {
  background-color: rgb(220,220,220);
}
menupopup, 
popup {
  background-color:rgb(255,255,255);
}

tree,
groupbox,
radiogroup,
listbox,
richlistbox {
  background-color:rgb(255,255,255);
  border:1px solid rgb(161,161,161);
}
groupbox,
radiogroup {
  -moz-border-radius:3px;
}
groupbox caption {
  border:1px solid rgb(161,161,161);  
  /* rounded corners to match that of the groupbox element */
  -moz-border-radius-topleft:3px;
  -moz-border-radius-topright:3px;
}

description,
caption,
label,
treechildren::-moz-tree-cell-text {
  color: rgb(40,40,40);
}

listheader,
treecols {
  border-bottom:1px solid rgb(161,161,161);
}
listheader,
treecol {
  border-right:1px solid rgb(161,161,161);
}
listheader > label,
treecol > label {
  color: rgb(101,101,101);
}

treecol[insertafter="true"],
treechildren::-moz-tree-cell( insertafter ) {
  border-right: 1px solid rgb(131,131,131);
}
treecol[insertbefore="true"],
treechildren::-moz-tree-cell( insertbefore ) {
  border-left: 1px solid rgb(131,131,131);
}
richlistitem {
  border-bottom: 1px solid rgb(131,131,131);
}

menu,
menuitem,
listitem {
  background-color: rgb(255,255,255);
}

/* treecolAutoCompleteComment is document.title in the case of the location bar */
.autocomplete-treebody::-moz-tree-cell-text( treecolAutoCompleteComment ) {
  color: rgb(131,131,131);
}

/* progress meters in trees do not support background-images or list-style-images
   we'll fall back on a translucent solid color
   note: rgba(0~255, 0~255, 0~255, 0.0~1.0) */
treechildren::-moz-tree-progressmeter {
  color:rgba(0,0,0,0.50);
}

treechildren::-moz-tree-separator {
  border-top: 1px dotted rgb(161,161,161);
}

toolbar,
menubar,
.generic-bar {
  background-color: rgb(220,220,220);
}
toolbar,
menubar,
.generic-bar {
  border-bottom:1px solid rgb(131,131,131);
}
toolbarseparator {
  background-color:rgb(131,131,131);
}

/* shortcut keys displayed in menus */
.menu-accel,
.menu-iconic-accel {
  color:rgb(131,131,131);
}

tooltip {  
  background-color: rgb(255,255,215);
}
progressmeter,
sb-status-progressmeter {
  border:1px solid rgb(131,131,131);
}

.dialog-button-box,
.wizard-buttons,
.device-tab-button-box,
.paneDeckContainer+hbox,
#addonsMsg+vbox {
  background-color:rgb(220,220,220);
  border-top:1px solid rgb(131,131,131);
}



/******************************************************************************
> TEXTBOXES
  
  Styles for textboxes and elements that we want to look like textboxes
******************************************************************************/
textbox,
.datetimepicker-input-subbox,
.datetimepicker-year,
sb-rating,
.menulist-editable-box {
  background-color:rgb(255,255,255);

  border-top:1px solid rgb(120,120,120);
  border-right:1px solid rgb(140,140,140);
  border-bottom:1px solid rgb(200,200,200);
  border-left:1px solid rgb(140,140,140);
}

/*
  Edited state - mainly used for the track editor
*/
textbox[edited="true"],
sb-rating[edited],
searchbar:not([empty="true"])[livesearchmode="true"] .search-go-button,
searchbar:not([empty="true"])[livesearchmode="true"] .searchbar-textbox {
  background-color:rgb(255,255,215) !important;
}

/*
  Focused state
*/
textbox[focused="true"]:not(.plain),
searchbar[focused="true"] .search-go-button,
searchbar[focused="true"] .searchbar-textbox {
  background-color: rgb(255,255,235) !important;
}

/*
  Invalid state 
*/
textbox[invalid="true"],
textbox[focused="true"][invalid="true"] {
  background-color:rgb(255,200,200) !important;
  color:rgb(235,40,40);
} 
textbox[empty="true"],
searchbar[empty="true"] > hbox > hbox > .searchbar-textbox {
  color:rgb(131,131,131);
}



/******************************************************************************
> BUTTONS

  Normal buttons, buttons in toolbars, menu buttons, and menubutton buttons.
******************************************************************************/

button,
toolbarbutton,
menulist {
  -moz-border-radius:3px;
  border:1px solid rgb(120,120,120);
}

button:focus,
toolbarbutton:focus,
checkbox:focus > .checkbox-check,
radio[focused="true"] > .radio-check,
menulist:focus {
  outline:2px solid rgba(40,40,40,0.33);
  outline-offset:0px;
  -moz-outline-radius:5px;
}
radio[focused="true"] > .radio-check {
  /* this makes the outline look like a circle which matches the radio button well */
  -moz-outline-radius:8px;
}
button.button-menubutton-button:focus {
  /* this is the best we can do - the right outline is 1px offset too much */
  outline-offset:1px;
  -moz-outline-radius-topright:0px;
  -moz-outline-radius-bottomright:0px;
}



/******************************************************************************
> TABS

  Vanilla tabs - they can be on top, at the bottom, left or right.
******************************************************************************/
/**
  Base
**/
tabbox {
  background-color:rgb(245,245,245);
}
tabpanels {
  background-color:rgb(255,255,255);
}
tabs {
  background-color: rgb(220,220,220);
}
tab {
  border:1px solid rgb(131,131,131);
}

/**
  Top
**/
tabs[orient="horizontal"] {
  border-bottom:1px solid rgb(131,131,131);
}
tabs[orient="horizontal"] tab {
  -moz-border-radius:0px;
  -moz-border-radius-topleft:3px;
  -moz-border-radius-topright:3px;
}
tabs[orient="horizontal"] tab[selected="true"] {
  border:1px solid rgb(131,131,131);
  border-bottom:1px solid rgb(200,200,200);
}

/**
  Bottom
**/
tabs[orient="horizontal"].tabs-bottom {
  border-top:1px solid rgb(131,131,131);
}
tabs[orient="horizontal"].tabs-bottom tab {
  -moz-border-radius:0px;
  -moz-border-radius-bottomleft:3px;
  -moz-border-radius-bottomright:3px;
}
tabs[orient="horizontal"].tabs-bottom tab[selected="true"] {
  border:1px solid rgb(131,131,131);
  border-top:1px solid rgb(200,200,200);
}

/**
  Right
**/
tabs[orient="vertical"] {
  border-left:1px solid rgb(131,131,131);
}
tabs[orient="vertical"] tab {
  -moz-border-radius:0px;
  -moz-border-radius-topright:3px;
  -moz-border-radius-bottomright:3px;
}
tabs[orient="vertical"] tab[selected="true"] {
  border:1px solid rgb(131,131,131);
  border-left:1px solid rgb(200,200,200);
}

/**
  Left
**/
tabs[orient="vertical"].tabs-left {
  border-right:1px solid rgb(131,131,131);
}
tabs[orient="vertical"].tabs-left tab {
  -moz-border-radius:0px;
  -moz-border-radius-topleft:3px;
  -moz-border-radius-bottomleft:3px;
}
tabs[orient="vertical"].tabs-left tab[selected="true"] {
  border:1px solid rgb(131,131,131);
  border-right:1px solid rgb(200,200,200);
}



/******************************************************************************
> NOTIFICATION

  Used for displaying notification hats in the browser and metadata editor.
******************************************************************************/
notification,
.dialog-notification {
  border-bottom:1px solid rgb(131,131,131);
}
notification[type="info"],
.dialog-notification.notification-info {
  /* blue */
  background-color: rgb(214,241,250);
}
notification[type="warning"],
.dialog-notification.notification-warning {
  /* yellow */
  background-color: rgb(249,249,202);
}
notification[type="critical"],
.dialog-notification.notification-critical {
  /* red */
  background-color: rgb(251,161,165);
}



/******************************************************************************
> STATUS BAR

  One for the browser and another for the service pane
******************************************************************************/
statusbar {
  border-top:1px solid rgb(131,131,131);
}
#servicepane-status-bar-box,
#status-bar-box {
  border-top:1px solid rgb(131,131,131);
  border-bottom:1px solid rgb(131,131,131);
}
.service-pane-spring-load-button,
.servicepane-toolbar-newitem-button,
sb-displaypane-button > button {
  border-right: 1px solid rgb(161,161,161);
  border-left: 1px solid rgb(161,161,161);
}



/******************************************************************************
> SELECTED STATES
******************************************************************************/

/**
  Unfocused
**/
listitem[selected="true"],
richlistitem[selected="true"],
treechildren::-moz-tree-row( selected, even ) {
  background-color: rgb(225,225,225);
}
/* alternating rows for trees */
treechildren::-moz-tree-row( selected, odd ) {
  background-color: rgb(220,220,220);
}

/**
  Focused
**/
listbox:focus listitem[selected="true"],
richlistbox:focus richlistitem[selected="true"],
menu[_moz-menuactive="true"],
menuitem[_moz-menuactive="true"],
treechildren.autocomplete-treebody::-moz-tree-row( selected even ),
treechildren::-moz-tree-row( selected focus even ) {
  background-color: rgb(169,212,255);
}
/* alternating rows for trees */
treechildren.autocomplete-treebody::-moz-tree-row( selected odd ),
treechildren::-moz-tree-row( selected focus odd ) {
  background-color: rgb(164,207,250);
}

/**
  Text
**/
listitem[selected="true"] label,
richlistitem[selected="true"] label,
richlistitem[selected="true"] description,
menu[_moz-menuactive="true"] > label,
menuitem[_moz-menuactive="true"] > label,
.autocomplete-treebody::-moz-tree-cell-text(selected),
treechildren::-moz-tree-cell-text( selected ),
treechildren::-moz-tree-cell-text( selected, focus ) {
  color:rgb(0,0,0);
}



/******************************************************************************
> DISABLED STATES
******************************************************************************/
*[disabled="true"] {
  opacity:0.5;
}
richlistitem[isDisabled="true"] > * {
  opacity:0.5;
}
dropmarker[disabled="true"] > .dropmarker-icon {
  opacity:0.5;
}
toolbarbutton[disabled="true"] > .toolbarbutton-icon,
toolbarbutton[disabled="true"] > .toolbarbutton-menu-dropmarker,
toolbarbutton[disabled="true"] > .toolbarbutton-menulist-dropmarker {
  opacity:0.25;
}
.service-pane-spring-load-button[disabled="true"] >.button-box {
  opacity:0.5;
}



/******************************************************************************
> TITLE BAR
******************************************************************************/
#sb-sys-title-title {
  font-weight:bold;
}
#titlebar_box {
  border-bottom:1px solid rgb(131,131,131);
}
/* used for Linux and Windows only - this is the file menu displayed in the title bar*/
#main-menubar > menu[_moz-menuactive="true"][open="true"] {
  background-color:rgb(180,180,180);
}



/******************************************************************************
> SERVICE PANE
******************************************************************************/
#servicepane {
  background-color: rgb(220,220,220);
}
.servicepane-tree > treechildren::-moz-tree-cell-text(selected) {
  font-weight:bold;
}
/* container nodes get special treatment so they look unclickable */
.servicepane-tree > treechildren::-moz-tree-cell-text( servicesource-bookmarks ),
.servicepane-tree > treechildren::-moz-tree-cell-text( servicesource-playlists ),
.servicepane-tree > treechildren::-moz-tree-cell-text( folder ) {
  color:rgb(101,101,101) !important;
  font-weight:normal !important;
}

/* rm bottom border for treecols */
#servicepane treecols {
  border:none;
}
/* rm empty.png */
.servicepane-tree {
  background-image:none;
}
.servicepane-tree > treechildren::-moz-tree-row {
  /* rm alternating row colors */
  background-color:transparent;

  /* borders for reordering rows */
  border-top:1px solid transparent;
  border-bottom:1px solid transparent;
}

.servicepane-tree > treechildren::-moz-tree-row( dropBefore ) {
  border-top:1px solid rgb(131,131,131);
}
.servicepane-tree > treechildren::-moz-tree-row( dropAfter ) {
  border-bottom:1px solid rgb(131,131,131);
}

/* this is th style used when items are dragged over applicable rows */
.servicepane-tree > treechildren::-moz-tree-row( dropOn ) {
  background-color:rgb(200,200,200);
  border:2px solid rgb(131,131,131);
  -moz-border-radius:6px;
}




/******************************************************************************
> DRAG BADGE

  Appears when dragging media items - it's a combination of an image and a badge with a count
******************************************************************************/
.sb-playlist-drag-badge:not([value="1"]) {
  color:rgb(255,255,255);
  font-weight: bold;
  background-color: rgb(0,0,0);
  -moz-border-radius: 4px;
}



/******************************************************************************
> FACEPLATE

  Appears when dragging media items - it's a combination of an image and a badge with a count
******************************************************************************/
.faceplate-text {
  color:rgb(250,250,250);
}
#sb-player-title-label-label {
  font-weight:bold;
}
#sb-player-artist-label-label,
#sb-player-album-label-label {
  color:rgb(215,215,215);
}
#sb-player-timeelapsed-label > label,
#sb-player-totaltime-label > label {
  color:rgb(140,140,140);
  font-size:9px !important;
}



/******************************************************************************
> PLAYLIST COMMAND BAR

  A bar used to hold buttons for media lists - eg: downloads, smart playlists
******************************************************************************/
.sb-commands-toolbar {
  background-color: rgb(220,220,220);
  border-top:1px solid rgb(131,131,131);
}



/******************************************************************************
> NAV BAR
******************************************************************************/

#nav-bar toolbarbutton {  
  background-color:rgb(255,255,255);
  border:1px solid rgb(80,80,80);
  -moz-border-radius:2px;
}
#nav-bar toolbarbutton button {
  -moz-border-radius:2px;
}
#nav-bar toolbarbutton[type="menu-button"] > .toolbarbutton-menubutton-button {
  border-right:1px solid rgb(80,80,80);
}


/**
  Location bar and search bar in the nav bar
**/
.locationbar-textbox,
.searchbar-textbox,
#searchbar .search-go-button {
  background-color:rgb(230,230,230);

  border-top:1px solid rgb(80,80,80);
  border-right:1px solid rgb(80,80,80);
  border-bottom:1px solid rgb(140,140,140);
  border-left:1px solid rgb(80,80,80);
}
.searchbar-engine-button {  
  background-color:rgb(180,180,180);
    
  -moz-border-radius:0 !important;
  -moz-border-radius-topleft:2px !important;
  -moz-border-radius-bottomleft:2px !important;
  border:1px solid rgb(80,80,80);
}
/* highlight the menu item when it's available */
.addengine-item {
  background-color:rgb(255,255,215);
}



/******************************************************************************
> DISPLAY PANES
******************************************************************************/
.sb-displaypane-header {
  border-bottom:1px solid rgb(131,131,131);
}

.empty-message {
  -moz-border-radius:8px;
  background-color:rgb(235,235,235);
  border:1px solid rgb(200,200,200);
  color:rgb(120,120,120);
}

.drop-message {
  color:rgb(120,120,120);
}

/******************************************************************************
> SPLITTERS
******************************************************************************/
#servicepane_splitter,
#filter_splitter,
#displaypane_right_sidebar_splitter {
  background-color:rgb(220,220,220);
  border-right:1px solid rgb(131,131,131);
  border-left:1px solid rgb(131,131,131);
}
#servicepane_splitter {
  border-bottom:1px solid rgb(131,131,131);
}
#filter_splitter {
  border-right:1px solid rgb(161,161,161);
  border-left:1px solid rgb(161,161,161);  
}

#displaypane_contentpane_bottom_splitter,
#displaypane_servicepane_bottom_splitter,
.playlist-splitter,
.playlist-web-splitter {
  border-bottom:1px solid rgb(131,131,131);
  border-top:1px solid rgb(131,131,131);
}
.playlist-splitter {
  border-top:1px solid rgb(161,161,161);
  border-bottom:1px solid rgb(161,161,161);  
}
.playlist-web-splitter {
  border-bottom:1px solid rgb(161,161,161);  
}



/******************************************************************************
> DEVICE SUMMARY PAGE

  The page that is displayed when the device node is clicked on - iPod, MTP
******************************************************************************/
/* the top half of the summary page + background for tabs (ipod only) */
#overall_device_info_box,
#device_management_tabs {
  background-color: rgb(220,220,220);
}
/* label for the legend that shows total file size */
.capacity_value_label {
  color:rgb(131,131,131);
}
.device-capacity-music,
.device-capacity-legend-color-box[type="music"] {
  background-color: rgb(0,105,245);
}
.device-capacity-video,
.device-capacity-legend-color-box[type="video"] {
  background-color: rgb(70,200,0);
}
.device-capacity-other,
.device-capacity-legend-color-box[type="other"] {
  background-color: rgb(255,210,0);
}
.device-capacity-free,
.device-capacity-legend-color-box[type="free"] {
  background-color: rgb(235,235,235);
}
/* the device capacity bar has 9 notches (10 sections)
   note: rgba(0~255, 0~255, 0~255, 0.0~1.0) */
.device-capacity-bar-notches hbox+hbox {
  border-left: 1px solid rgba(0,0,0,0.1);
}
/* box that holds all the buttons for sync settings */
.device-tab-button-box {
  -moz-border-radius:3px;
  border:1px solid rgb(131,131,131);
}



/******************************************************************************
> WIZARDS
******************************************************************************/

.wizard-header {
  background-color: rgb(220,220,220);
  border-bottom:1px solid rgb(131,131,131);
}

.sb-wizard-header {
  font-weight:bold;
  font-size:120%;
}



/******************************************************************************
> FIRST RUN WIZARD
******************************************************************************/
.sb-first-run-eula-browser {
  border:1px solid rgb(131,131,131);
}



/******************************************************************************
> TRACK EDITOR
******************************************************************************/
/* the track editor has tabs and tabpanels but are hidden for the time being
   this rule makes the tabpanels have the same background color as a dialog window */
#track_editor tabpanels {
  background-color: rgb(245,245,245);
}
.art {
  background-color:rgb(255,255,255);
  border:1px solid rgb(140,140,140);
}
.art:focus {
  background-color:rgb(255,255,235);
  border:2px solid rgb(140,140,140);
}



/******************************************************************************
> MEDIACORE ERROR DIALOG
******************************************************************************/
#mediacore_error > sb-sys-outer-frame > .dialog-content-box {
  overflow: visible;
}

#mediacore_error_desc_box {
  width: 440px;
}

/******************************************************************************
> SMART PLAYLIST EDITOR

  Dialog for editing properties of smart playlists.
******************************************************************************/
/* the box that contains n number of rules */
.drawer-box {
  background-color:rgb(245,245,245);
  border:1px solid rgb(131,131,131);
  -moz-border-radius:3px;
}



/******************************************************************************
> ABOUT DIALOG
******************************************************************************/
#about_browser {
  border-top:1px solid rgb(131,131,131);
}



/******************************************************************************
> FIND BAR
******************************************************************************/
findbar {
  background-color:rgb(220,220,220);
  border-bottom:1px solid rgb(131,131,131);
}
/* text that shows the status of the search - eg: "Phrase now found" */
findbar > .findbar-container > .findbar-find-status {
  color:rgb(131,131,131);
}



/******************************************************************************
> SCROLLBAR

  These styles are used for scrollbars and scroll buttons in the chrome AND in the browser window
******************************************************************************/
scrollbarbutton,
scrollbar > slider > thumb {   
  border:1px solid rgb(161,161,161);
  -moz-border-radius:2px;
}



/******************************************************************************
> WINDOW RESIZERS
  
  Draw a border around windows that are resizable - Linux and Windows only
  Make sure to update skin/window/bg-resizer-bottom-corner.png to match changes made here
******************************************************************************/
.sb-sys-outer-frame-resizer {
  background-color:rgb(161,161,161);
}
.sb-sys-outer-frame-resizer[dir="top"],
.sb-sys-outer-frame-resizer[dir="bottom"],
.sb-sys-outer-frame-resizer-topleft,
.sb-sys-outer-frame-resizer-topright {
  border-top:1px solid rgb(131,131,131);
}
.sb-sys-outer-frame-resizer-bottomleft,
.sb-sys-outer-frame-resizer-bottomright,
.sb-sys-outer-frame-resizer[dir="bottom"] {
  border-bottom:1px solid rgb(131,131,131);
}
.sb-sys-outer-frame-resizer[dir="left"],
.sb-sys-outer-frame-resizer[dir="right"],
.sb-sys-outer-frame-resizer-rightbottom,
.sb-sys-outer-frame-resizer-leftbottom,
.sb-sys-outer-frame-resizer-righttop,
.sb-sys-outer-frame-resizer-lefttop,
.sb-sys-outer-frame-resizer-topright,
.sb-sys-outer-frame-resizer-bottomright {
  border-right:1px solid rgb(131,131,131);
}
.sb-sys-outer-frame-resizer[dir="left"],
.sb-sys-outer-frame-resizer[dir="right"],
.sb-sys-outer-frame-resizer-rightbottom,
.sb-sys-outer-frame-resizer-leftbottom,
.sb-sys-outer-frame-resizer-righttop,
.sb-sys-outer-frame-resizer-lefttop,
.sb-sys-outer-frame-resizer-topleft,
.sb-sys-outer-frame-resizer-bottomleft {
  border-left:1px solid rgb(131,131,131);
}



/******************************************************************************
> FILE DOWNLOAD MANAGER (MOZAPP)
******************************************************************************/
#downloadManager > #downloadView {
  background-color:rgb(255,255,255);
}
#downloadManager > #search {
  background-color: rgb(220,220,220);
  border-top:1px solid rgb(131,131,131);
}



/******************************************************************************
> ABOUT CONFIG (MOZAPP)
******************************************************************************/
#filterRow {
  background-color: rgb(220,220,220);
  border-bottom:1px solid rgb(131,131,131);
}



/******************************************************************************
> PREFERENCES (MOZAPP)
******************************************************************************/
/* this dude is really a radiogroup... */
.paneSelector {
  background-color: rgb(220,220,220) !important;
  border-right:1px solid rgb(131,131,131) !important;
}
.paneSelector > radio[selected="true"] {
  background-color:rgb(255,255,255) !important;
}

/* this dude is really a radiogroup... */
#viewGroup {
  background-color: rgb(220,220,220);
  border-bottom: 1px solid rgb(131,131,131) !important;
}
/* make the radio button look like a tab */
#viewGroup > radio {
  background-color:rgb(200,200,200) !important;
  border:1px solid rgb(131,131,131);
  -moz-border-radius-topleft:3px;
  -moz-border-radius-topright:3px;
}
#viewGroup > radio[selected="true"] {
  background-color:rgb(255,255,255) !important;
  border:1px solid rgb(131,131,131) !important;
  border-bottom:1px solid rgb(200,200,200) !important;
}

#paneAddons {
  /* adding a background color to fake making the add-on window look like a normal pref pane */
  background-color:rgb(220,220,220);
}



/******************************************************************************
> FIREFOX API

  Songbird does not use the following rules but add-ons ported from Firefox might.
******************************************************************************/
html|*.error-text,
.error-text {
  color: rgb(255,0,0);
}

/* text that looks like a link */
.text-link {
  color:#1694d9;
  text-decoration:none;
}
.text-link:hover {
  text-decoration:underline;
} 
.text-link:hover:active {
} 
.text-link[visited="true"] {
}


